<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>项目-项目详情 </title>

    <!-- Bootstrap -->
      <link href="/resa/vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
	  <link href="/resa/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
	  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css"  crossorigin="anonymous">
	  <link href="/resa/themes/explorer-fas/theme.css" media="all" rel="stylesheet" type="text/css"/>

	  <!-- Font Awesome -->
    <link href="/resa/vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <!-- NProgress -->
    <link href="/resa/vendors/nprogress/nprogress.css" rel="stylesheet">
    <!-- iCheck -->
    <link href="/resa/vendors/iCheck/skins/flat/green.css" rel="stylesheet">

    <!-- Custom Theme Style -->
    <link href="/resa/build/css/custom.min.css" rel="stylesheet">
	  <!-- PNotify -->
	  <link href="/resa/vendors/pnotify/dist/pnotify.css" rel="stylesheet">
	  <link href="/resa/vendors/pnotify/dist/pnotify.buttons.css" rel="stylesheet">
	  <link href="/resa/vendors/pnotify/dist/pnotify.nonblock.css" rel="stylesheet">
    <style>
    		::-webkit-scrollbar {/*滚动条*/
		    width:5px;
		}
		::-webkit-scrollbar-track {/*滚动槽*/
		    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.3);
		    border-radius:10px;
		}
		::-webkit-scrollbar-thumb {/*滚动条滑块*/
		    border-radius:10px;
		    background:rgba(0,0,0,0.1);
		    -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5);
		}	
    .nav li{
    float: left;
    margin: 0 10px;
    }	
    .nav>li>a {
    padding: 6px 15px 12px;
}		
		.nav>li.active{
			border-bottom: 2px solid #00c292;
		}
		
		
			.lines{
    		    line-height: 27px;
    		    border-left: 2px solid #1FD6BB;
    	}
    	.tables{
    		    width: 100%;
				    max-width: 100%;
				    margin-bottom: 20px;
				    /*text-align: center;*/
    	}
    	.tables thead{
    		text-align: center;
    	}
    	.tables tbody td{
    		padding-left: 10%;
    	}
    	.table-bordereds{
    		border: 1px solid #ddd
    	}
    	.mar{
    		    margin-top: 30px;
    	}
    	.yanfa{
    		color: #1FD6BB;
    	}
    	.task{
    		color: #64BF62;
    	}
    	.quexian{
    		color:#F95A55
    	}
		
    </style>
  </head>

  <body class="nav-md" style="background: #F0F0F0">
            <span style="display: none;" id="pid" th:text="${pid}"></span>
        <!-- page content -->
        <div class="right_col" role="main">
          <!--<div class="">
            <div class="page-title">
              <div class="title_left">
                <h3>Project Detail <small> design</small></h3>
              </div>

              <div class="title_right">
                <div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">
                  <div class="input-group">
                    <input type="text" class="form-control" placeholder="Search for...">
                    <span class="input-group-btn">
                      <button class="btn btn-default" type="button">Go!</button>
                    </span>
                  </div>
                </div>
              </div>
            </div>-->
            
            <div class="clearfix"></div>

            <div class="row" >
              <div class="">
              	
              	<div class="x_title" style="    border: 0px;
    padding: initial;
    background: white;
    margin-top: 10px;
    padding-top: 10px;
    padding-left: 17px;">
                     <div class="stat-icon dib flat-color-4">
                     		
                     		<div class="col-md-3" style="line-height: 33px;">
												 <i class="menu-icon fa fa-user" style="color: #22d7bb"></i>
												 	&nbsp;<a href="/resa/project/projects.do" class="links" th:text="${data.projectName}" style="color: #22d7bb">项目库</a></a>
			                  </div>
			                  
			                  <div class="col-md-9">
								                  	<div class="" role="tabpanel" data-example-id="togglable-tabs">

											                      <ul id="headUl" class="nav" role="tablist"  >
																	  <!--<li th:each="info,infoStat :${modulList}">-->
																		  <!--<span th:text="${info}"></span>-->
																	  <!--</li>-->
											                        <li role="presentation" class="active" ><a href="#tab_content1" id="home-tab" role="tab" data-toggle="tab" aria-expanded="true">任务</a>
											                        </li>
											                        <li role="presentation"  class="" th:each="info,infoStat :${modulList}">
																		<a th:if="${info.id==1}" href="#tab_content2" role="tab" id="profile-tab" data-toggle="tab" aria-expanded="false" >时间</a>
																		<a th:if="${info.id==2}" href="#tab_content3" role="tab" id="profile-tab2" data-toggle="tab" aria-expanded="false">报表</a>
																	</li>
											                        <!--<li role="presentation" class="" ><a href="#tab_content3" role="tab" id="profile-tab2" data-toggle="tab" aria-expanded="false">报表</a>-->
											                        <!--</li>-->


																	  <li role="presentation" class=""><a href="#tab_content4" role="tab" id="profile-tab3" data-toggle="tab" aria-expanded="false">概述</a>
											                        </li>
											                        
											                         <li role="presentation" class="" style="float: right;"><a href="#tab_content5" role="tab" id="profile-tab4" data-toggle="tab" aria-expanded="false"><i class="fa fa-cog" style='color: #00c292;'></i>&nbsp;设置</a>
											                        </li>
											                      </ul>
											                     
					              					</div>
                    		</div>
			                    
			                  </div>
			                  <!--<div class="col-md-3">
			                    <ul class="nav navbar-right panel_toolbox">
			                      <li class="dropdown">
			                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false" style="color: #878787;"><i class="fa fa-wrench"></i>设置</a>
			                        <ul class="dropdown-menu" role="menu">
			                          <li><a href="#">删除项目</a>
			                          </li>
			                        </ul>
			                      </li>
			                    </ul>
			                    </div>-->
			                    
			                      
			                    
			                    
			                   <div class="clearfix" style="background: white;"></div>
                      </div>
                  </div>
              	
                <div class="x_panel">
                  

                  <div class="x_content">
											
										 <div id="myTabContent" class="tab-content">
										 													<!--
			                                         	作者：1989484309@qq.com
			                                         	时间：2019-03-04
			                                         	描述：任务
			                                         -->
													<div role="tabpanel" class="tab-pane fade active in" id="tab_content1" aria-labelledby="home-tab">

															 <div class="embed-responsive embed-responsive-16by9" style="height:610px;;">
																						  <iframe id="table-data" name="home-tab" class="embed-responsive-item" th:attr="src='/resa/project/project_table/'+${pid}+'.do'" ></iframe>
															 </div>


													</div>
											                        <!--
                                                	作者：1989484309@qq.com
                                                	时间：2019-03-04
                                                	描述：时间
                                                -->
											                        <div role="tabpanel" class="tab-pane fade" id="tab_content2" aria-labelledby="profile-tab">
											                          	<div class="row">
											                          			<div class="col-md-3" style="     position: absolute;top: 16px;left: 55px;">
											                          				<span class="card-header">
											                          					编号
											                          				</span>
											                          			</div>
												                          		<div class="col-md-3" style="     position: absolute;top: 9px;left: 244px;z-index: 1000;">
												                          				<span class="card-header">
												                          					<!--<a href="#" class="dropdown-toggle" data-toggle="dropdown">
																														全部任务	<b class="caret"></b></a>-->
																														 <ul class="nav nav">
																														 <li class="dropdown">
																			                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">全部任务	<b class="caret"></b></a>
																			                        <ul class="dropdown-menu" role="menu">
																			                          <li><a href="#">Settings 1</a>
																			                          </li>
																			                          <li><a href="#">Settings 2</a>
																			                          </li>
																			                        </ul>
																			                      </li>
																			                     </ul>
												                          				</span>
												                          			</div>
											                          	</div>
											                          	
											                          	<div class="embed-responsive embed-responsive-16by9" style="height: 500px;">
																									  <iframe id="table-data" name="profile-tab1" class="embed-responsive-item" th:attr="src='/resa/project/gantetu/gantetu/'+${pid}+'.do'" ></iframe>
																									</div>
											                          
											                        </div>
											                        <!--
                                                	作者：1989484309@qq.com
                                                	时间：2019-03-04
                                                	描述：	报表
                                                -->
											                        <div role="tabpanel" class="tab-pane fade" id="tab_content3" aria-labelledby="profile-tab">
											                         	<div class="embed-responsive embed-responsive-16by9" style="height: 500px;">
																									  <iframe id="table-data" name="profile-tab2" class="embed-responsive-item" th:attr="src='/resa/project/baobiao/plain_page/'+${pid}+'.do'" ></iframe>
																		</div>
											                         	
											                        </div>	
											                        <!--
                                                	作者：1989484309@qq.com
                                                	时间：2019-03-04
                                                	描述：概述
                                                -->
											                        <div role="tabpanel" class="tab-pane fade" id="tab_content4" aria-labelledby="profile-tab">
											                          			       <!--
                                                                                         	作者：1989484309@qq.com
                                                                                         	时间：2019-03-04
                                                                                         	描述：概述
                                                                -->
											                          			       <div class="col-md-9 col-sm-9 col-xs-12">
																						                      <ul class="stats-overview">
																						                        <li>
																						                          <span class="name"> 参与人数 </span>
																						                          <span class="value text-success" th:text="${data.people}+'/人'"> 2300.00 </span>
																						                        </li>
																						                        <li>
																						                          <span class="name"> 总花费天 </span>
																						                          <span class="value text-success" th:text="${data.nowDay}+'/天'"> 2000.00 </span>
																						                        </li>
																						                        <li class="hidden-phone">
																						                          <span class="name"> 预计项目期限 </span>
																						                          <span class="value text-success" th:text="${data.endData}+'/天'"> 20 </span>
																						                        </li>
																						                      </ul>
																						                      <br />
																						
																						                      <div id="mainbs" style="height:350px;width: 800px"></div>
																						
																						                      <div>
																						
																						                        <h4>近期活动</h4>
																						
																						                        <!-- end of user messages -->
																						                        <ul id="logshow" class="messages">
																						                          <!--<li >-->
																						                            <!--<img  src="" class="avatar" alt="Avatar">-->
																						                            <!--<div class="message_date">-->
																						                              <!--<h3 class="date text-info" >24</h3>-->
																						                              <!--<p class="month">May</p>-->
																						                            <!--</div>-->
																						                            <!--<div class="message_wrapper">-->
																						                              <!--<h4 class="heading">用户名</h4>-->
																						                              <!--<blockquote class="message" >Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth.</blockquote>-->
																						                              <!--<br />-->
																						                              <!--<p class="url">-->
																						                                <!--<span class="fs1 text-info" aria-hidden="true" data-icon=""></span>-->
																						                                <!--<a href="#" ><i class="fa fa-paperclip"></i>-->
																															<!--<span >User Acceptance Test.doc</span> </a>-->
																						                              <!--</p>-->
																						                            <!--</div>-->
																						                          <!--</li>-->
																						                          <!--<li>-->
																						                            <!--<img src="images/img.jpg" class="avatar" alt="Avatar">-->
																						                            <!--<div class="message_date">-->
																						                              <!--<h3 class="date text-error">21</h3>-->
																						                              <!--<p class="month">May</p>-->
																						                            <!--</div>-->
																						                            <!--<div class="message_wrapper">-->
																						                              <!--<h4 class="heading">Brian Michaels</h4>-->
																						                              <!--<blockquote class="message">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth.</blockquote>-->
																						                              <!--<br />-->
																						                              <!--<p class="url">-->
																						                                <!--<span class="fs1" aria-hidden="true" data-icon=""></span>-->
																						                                <!--<a href="#" data-original-title="">Download</a>-->
																						                              <!--</p>-->
																						                            <!--</div>-->
																						                          <!--</li>-->
																						                          <!--<li>-->
																						                            <!--<img src="images/img.jpg" class="avatar" alt="Avatar">-->
																						                            <!--<div class="message_date">-->
																						                              <!--<h3 class="date text-info">24</h3>-->
																						                              <!--<p class="month">May</p>-->
																						                            <!--</div>-->
																						                            <!--<div class="message_wrapper">-->
																						                              <!--<h4 class="heading">Desmond Davison</h4>-->
																						                              <!--<blockquote class="message">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth.</blockquote>-->
																						                              <!--<br />-->
																						                              <!--<p class="url">-->
																						                                <!--<span class="fs1 text-info" aria-hidden="true" data-icon=""></span>-->
																						                                <!--<a href="#"><i class="fa fa-paperclip"></i> User Acceptance Test.doc </a>-->
																						                              <!--</p>-->
																						                            <!--</div>-->
																						                          <!--</li>-->
																						                        </ul>
																						                        <!-- end of user messages -->
																						
																						
																						                      </div>
																						
																						
																						                    </div>
																						
																						                    <!-- start project-detail sidebar -->
																						                    <div class="col-md-3 col-sm-3 col-xs-12">
																						
																						                      <section class="panel">
																						
																						                        <div class="x_title">
																						                          <h2>项目描述</h2>
																						                          <div class="clearfix"></div>
																						                        </div>
																						                        <div class="panel-body">
																						                          <h3 class="green"><i class="fa fa-paint-brush"></i>Description</h3>
																						
																						                          <p th:text="${data.detail}">Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua butcher retro keffiyeh dreamcatcher synth. Cosby sweater eu banh mi, qui irure terr.</p>
																						                          <br />
																						
																						                          <div class="project_detail">
																						
																						                            <!--<p class="title">客户公司</p>-->
																						                            <!--<p>sd公司</p>-->
																						                            <p class="title">项目负责人</p>
																						                            <p th:if="${data.mainPeople==null}">未指定</p>
																													  <p th:if="${data.mainPeople!=null}" th:text="${data.mainPeople.account}">Tony Chicken</p>

																												  </div>
																						
																						                          <br />
																												<p class="title">项目文件</p>
																						                          <ul id="files" class="list-unstyled project_files">
																													<!--<li><a href=""><i class="fa fa-file-word-o"></i> Functional-requirements.docx</a>-->
																						                            <!--</li>-->
																						                            <!--<li><a href=""><i class="fa fa-file-pdf-o"></i> UAT.pdf</a>-->
																						                            <!--</li>-->
																						                            <!--<li><a href=""><i class="fa fa-mail-forward"></i> Email-from-flatbal.mln</a>-->
																						                            <!--</li>-->
																						                            <!--<li><a href=""><i class="fa fa-picture-o"></i> Logo.png</a>-->
																						                            <!--</li>-->
																						                            <!--<li><a href=""><i class="fa fa-file-word-o"></i> Contract-10_12_2014.docx</a>-->
																						                            <!--</li>-->
																						                          </ul>
																						                          <br />
																						
																						                          <div class="text-center mtop20">
																						                            <a href="#" id="addFile" class="btn btn-sm btn-primary">添加文件</a>
																						                            <!--<a href="#" class="btn btn-sm btn-warning">Report contact</a>-->
																						                          </div>
																						                        </div>
																						
																						                      </section>
																						
																						                    </div>
																						                    <!-- end project-detail sidebar -->
											                          
											                          
											                        </div>	
																							
																							
																							<!--
                                                	作者：1989484309@qq.com
                                                	时间：2019-03-04
                                                	描述：设置
                                                -->
																							<div role="tabpanel" class="tab-pane fade" id="tab_content5" aria-labelledby="profile-tab">
											                          	<div class="embed-responsive embed-responsive-16by9" style="height: 500px;">
																									  <iframe id="table-data" name="profile-tab4" class="embed-responsive-item" th:attr="src='/resa/project/setting/setting_page/'+${pid}+'.do'"></iframe>
																									</div>
											                        </div>	
										
             

                  </div>
               
                  
                  </div>
              </div>
            </div>
          </div>
        </div>
        <!-- /page content -->
<div class="modal modals fade" id="fileUpload" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" > <!--data-backdrop="static"-->
				<div class="modal-dialog" >

					<div class="modal-content">
						<!-- /page content -->




						<form  enctype="multipart/form-data" >
							<div class="file-loading">
								<input id="kv-explorer"  name="file" type="file" multiple>
							</div>
							<br>
						</form>



					</div>
				</div>
			</div>

    <!-- jQuery -->
    <script src="/resa/vendors/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap -->
    <script src="/resa/vendors/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- FastClick -->
    <script src="/resa/vendors/fastclick/lib/fastclick.js"></script>
    <!-- NProgress -->
    <script src="/resa/vendors/nprogress/nprogress.js"></script>
    <!-- ECharts -->
    <script src="/resa/vendors/echarts/dist/echarts.min.js"></script>
	<script src="/resa/js/fileinput.js" type="text/javascript"></script>

    <!-- Custom Theme Scripts -->
    <script src="/resa/build/js/custom.min.js"></script>
			<!-- PNotify -->
			<script src="/resa/vendors/pnotify/dist/pnotify.js"></script>
			<script src="/resa/vendors/pnotify/dist/pnotify.buttons.js"></script>
			<script src="/resa/vendors/pnotify/dist/pnotify.nonblock.js"></script>


			<script>
        var i=0;
        var datas=0;
		$(function(){

			var li=$("#headUl").find("li")
			console.log(li)
			$("#li").each(function(ii,mm){
				console.log(mm)
				($($(mm).find('a')[0]).attr("id")).window.location.reload(true);
			})

			showFiles();
            // console.log($($(".file-preview").find("span")[0]).parent());
            // $($(".file-preview").find("span")[0]).click();
			showLog();
            $.ajax({
				url:'/resa/project/task/detail/'+$('#pid').text()+'.do',
				dataType:'json',
				type:'POST',
				success:function (result) {
					bar(result);
				}
			})

            file();


		})
		//查询日志
		function showLog(){
			$("#logshow").html("");
			console.log("查询项目日志");
			$.ajax({
				url:'/resa/project/queryLog/'+$('#pid').text()+'.do',
				dataType:"json",
				type:"post",
				success:function(result){
					var content="";
				    if(result.code==200){
						console.log(result)
                        $(result.data).each(function(i,m){

                        	var file="";
                        	if(m.files!=null){
                        		file=
										'<p class="url">'+
										'<span class="fs1 text-info" aria-hidden="true" data-icon=""></span>'+
										'<a href="#" ><i class="fa fa-paperclip"></i>'+
										'<span >'+m.files.ftitle+'</span> </a>'+
										'</p>'
							}

                            content+='<li >'+
                                '<img  src="'+m.url+m.filePath+'" class="avatar" alt="Avatar">'+
                                '<div class="message_date">'+
                                '<h3 class="date text-info" >'+m.getLow+'</h3>'+

                                '</div>'+
                                '<div class="message_wrapper">'+
                                '<h4 class="heading">'+m.account+'</h4>'+
                                '<blockquote class="message" >'+m.descr+'</blockquote>'+
                                '<br />'+
                                file
                                '</div>'+
                                '</li>';
                        })
						$("#logshow").append(content)

					}
				}
			})
		}

		//查询项目文件
		function showFiles(){
			console.log("查询项目文件")
			$("#files").html("");
			$.ajax({
				url:'/resa/project/queryFileList/'+$('#pid').text()+'.do',
				dataType:"json",
				type:"post",
				success:function(result){
					var content="";
					if(result.code==200){
						console.log(result)
						if(result.data.length==0){
							content="还未添加文件"
						}else{
							$(result.data).each(function(i,m){
								content+='<li ><a href="#" onclick="fileDownload(this)" id="'+m.fid+'">'+m.ficon+m.ftitle+'</a></li>';
							})



						}

						$("#files").append(content);
					}
					console.log("contnt:"+content)

				}
			})

		}
		function fileDownload(data){
			//下载文件
			window.location.href="/resa/download/"+$(data).attr("id")+".do";


		}

        function file(){
            $("#addFile").click(function(){
                $("#fileUpload").modal("toggle");
            })
            $("#kv-explorer").fileinput({
                theme: 'explorer-fas',
                language: 'zh',
                uploadUrl: '/resa/project/fileUpload/project/'+$("#pid").text()+'.do',
                overwriteInitial: false,
                initialPreviewAsData: true,
            }).on('filepreupload', function(event, data, previewId, index) {     //上传中
                var form = data.form, files = data.files, extra = data.extra,
                    response = data.response, reader = data.reader;
                console.log('文件正在上传');
                console.log(files)
                datas=files.length;
                i++;
                console.log("data:"+datas);
                console.log("i:"+i);
            }).on("fileuploaded", function (event, data, previewId, index) {    //一个文件上传成功
                console.log('文件上传成功！'+data.id);
				new PNotify({
					title: "文件上传",
					text: "上传附件成功",
					type: "info",
					styling: 'bootstrap3'
				});
                if(i==datas){
					new PNotify({
						title: "文件上传",
						text: "所有附件上传完成",
						type: "success",
						styling: 'bootstrap3'
					});
					showFiles();
					showLog();

					i=0;
                }
            }).on('fileerror', function(event, data, msg) {  //一个文件上传失败
                console.log('文件上传失败！'+data.id);
            })




        }


        function bar(result){
            var echartBar = echarts.init(document.getElementById('mainbs'));

            echartBar.setOption({
                title: {
                    text: '项目统计',
                    subtext: '2019'
                },
                tooltip: {
                    trigger: 'axis'
                },
                color:['#1FD6BB','#3C763D'],
                legend: {
                    data: ['完成量', '总任务']
                },
                toolbox: {
                    show: false
                },
                calculable: false,
                xAxis: [{
                    type: 'category',
                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
                }],
                yAxis: [{
                    type: 'value'
                }],
                series: [{
                    name: '完成量',
                    type: 'bar',
                    data:result.map2,
                    // data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3],
                    markPoint: {
                        data: [{
                            type: 'max',
                            // name: '???'
                        }, {
                            type: 'min',
                            // name: '???'
                        }]
                    },
                    markLine: {
                        data: [{
                            type: 'average',
                            // name: '???'
                        }]
                    }
                }, {
                    name: '总任务',
                    type: 'bar',
                    data:result.map1,
                    // data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
//                     markPoint: {
//                         data: [
//                             {
// //								name: '完成量',
//                                 value: result.map1[11],
//                                 xAxis: 11,
//                                 yAxis: result.count.sum1,
//                             },
//                             {
//                                 name: '总任务',
//                                 value: result.map1[11],
//                                 xAxis: 11,
//                                 yAxis: result.count.sum1
//                             }]
//                     },
					markPoint: {
						data: [{
							type: 'max',
							// name: '???'
						}, {
							type: 'min',
							// name: '???'
						}]
					},
                    markLine: {
                        data: [{
                            type: 'average',
                            // name: '???'
                        }]
                    }
                }]
            });
        }


    </script>

  </body>
</html>